<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>管理员信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <script src="js/jquery-3.6.0.min.js"></script>
    <script>
        /* 初始化 */
        function init(form) {
            // 请求session中admin
            $.get("admin/getInfoBySession", function (data) {
                $("input[name='adminId']").attr("value", data.adminId)
                $("input[name='adminName']").attr("value", data.adminName)
                $("input[name='phoneNumber']").attr("value", data.phoneNumber)
                // jquery通过name找到的第一个标签
                $("input[name='sex'][title='男']").attr('checked', '男' === data.sex);
                $("input[name='sex'][title='女']").attr('checked', '女' === data.sex);
                // 更新全部（如果不更新表单，checked不生效！）
                form.render();
            });
        }

        /* Ajax异步更新用户信息 */
        function update(data) {
            //请求参数
            var admin = data.field;
            console.log(admin);
            $.ajax({
                //请求方式
                type: 'POST',
                //请求的媒体类型
                contentType: 'application/json;charset=UTF-8',
                //请求地址
                url: 'admin/update',
                //数据，json字符串
                data: JSON.stringify(admin),
                // 请求数据类型
                dataType: 'JSON',
                //请求成功
                success: function (data) {
                    console.log("success");
                    // 经过了fastjson自动转成了对象
                    if (data.code === 0) {
                        /* 调用顶层窗口的跳转方法 父窗口：window.parent */
                        window.top.location.href = 'admin_index.html';
                        window.top.alert("更新成功！");
                    } else {
                        layer.alert("修改失败！");
                    }
                },
                error: function () {
                    layer.alert("修改失败！");
                }
            });
        }

        function goBack() {
            window.top.location.href = 'javascript:history.go(-1)';
        }

    </script>

    <script src="layui/layui.js" charset="utf-8"></script>
    <script>
        layui.use(['layer', 'form'], function () {
            var form = layui.form,
                layer = layui.layer;
            init(form);
            //自定义验证规则
            form.verify({
                pass: [
                    /^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格'
                ],
            });

            //监听提交
            form.on('submit(demo1)', function (data) {
                // 验证密码
                var adminPwd = data.field['adminPwd'];
                // session域中获取的是对象属性，需要转成字符串进行比较
                $.get("admin/getInfoBySession", function (session_data) {
                    if (adminPwd !== session_data.adminPwd) {
                        alert("密码错误！");
                    } else {
                        update(data);
                    }
                });
            });

        });
    </script>
</head>

<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>管理员基本信息</legend>
</fieldset>

<form class="layui-form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">ID</label>
        <div class="layui-input-block">
            <input type="text" name="adminId" autocomplete="off"
                   disabled="true" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">管理员账号</label>
        <div class="layui-input-block">
            <input type="text" name="adminName" lay-verify="required" lay-reqtext="用户名是必填项，岂能为空？"
                   placeholder="请输入管理员账号" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">联系电话</label>
        <div class="layui-input-block">
            <input type="text" name="phoneNumber" autocomplete="off"
                   placeholder="请输入电话号码" lay-verify="required|phone" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">登录密码</label>
        <div class="layui-input-block">
            <input type="password" name="adminPwd" placeholder="请输入密码" autocomplete="off" class="layui-input"
                   lay-verify="pass">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">性别</label>
        <div class="layui-input-block">
            <input type="radio" name="sex" value="男" title="男">
            <input type="radio" name="sex" value="女" title="女">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit lay-filter="demo1" onclick="return false">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary" onclick="goBack()">返回</button>
        </div>
    </div>
</form>
</body>
</html>
